<template>
  <view style="position: relative">
    <!-- 全屏加载中 -->
    <!-- <u-loading-page
      image="/static/bookshelf/setup.png"
      imgStyle="width: 123px;height:123px"
      :loading="loading_show"
      loadingText="主人，再等等..."
      fontSize="16"
      style="z-index: 9999999"
    ></u-loading-page> -->
    <view style="background: #f0f8f5">
      <!-- <u-back-top
        :scroll-top="scrollTop"
        icon="/static/image/mkz_pic_detail_nlhd.png"
        :iconStyle="{
          width: '72rpx',
          height: '72rpx',
        }"
        :duration="300"
        z-index="9999"
      ></u-back-top> -->
      <!-- <u-navbar
        :safeAreaInsetTop="true"
        :placeholder="placeholder"
        :border="false"
        :fixed="false"
        :bgColor="nav_color"
      >
        <view
          class=""
          style="display: flex; justify-content: flex-start; width: 100%"
          slot="left"
        >
        </view>
        <view
          style="display: flex; justify-content: flex-end; width: 100%"
          slot="center"
        >
          <u-search
            :inputStyle="{ 'font-size': '13px' }"
            placeholder="搜搜漫画名或者作者名"
            height="60rpx"
            style="padding: 0 32rpx"
            :placeholderColor="'#FFFFFF'"
            :searchIconColor="'#FFFFFF'"
            :disabled="true"
            bgColor="rgba(249, 249, 249, 0.3)"
            :show-action="false"
            @click="search()"
          ></u-search>
        </view>
      </u-navbar> -->
      <image
        src="./images/search.png"
        style="
          position: absolute;
          right: 0;
          top: 62rpx;
          width: 112rpx;
          height: 72rpx;
        "
        @click="search()"
      ></image>
      <view style="width: 80%; padding-top: 50rpx">
        <u-tabs
          :current="tabIndex"
          lineWidth="0"
          line-height="0"
          :list="tabs"
          @click="click_tab"
          lineColor="#50CCA6"
          :activeStyle="{
            color: '#50CCA6',
          }"
          :inactiveStyle="{
            color: '#333',
          }"
        ></u-tabs>
      </view>
      <view class="content">
        <ContentItem @load="onLoadend"></ContentItem>
        <!-- <swiper
          :style="{ height: height }"
          :current="tabIndex"
          @change="swiperChange"
        >
          <swiper-item v-for="(tab, i) in tabs" :key="i">
            <mescroll-item
              ref="mescrollItem"
              :i="i"
              :index="tabIndex"
              :height="heightt"
              @myLoad="loading_show = false"
              @myEvent="getMsg"
              :up_nav_status="up_nav_status"
              :up_nav_height="statusHeight"
            ></mescroll-item>
          </swiper-item>
        </swiper> -->
      </view>
      <u-action-sheet :show="notice_show" round="32rpx">
        <view
          style="
            margin: 0 24rpx;
            display: flex;
            flex-direction: column;
            align-items: center;
            margin-top: 24rpx;
            margin-bottom: 42rpx;
          "
        >
          <image
            style="width: 176rpx; height: 176rpx; margin-bottom: 41rpx"
            src="../ucenter/teenager/images/bg.png"
          ></image>
          <text
            style="
              height: 50rpx;
              font-size: 34rpx;
              font-family: Helvetica;
              color: #000000;
              line-height: 50rpx;
              margin-bottom: 35rpx;
            "
          >
            未开启青少年模式
          </text>
          <text
            style="
              height: 208rpx;
              font-size: 30rpx;
              font-family: Helvetica;
              color: #333333;
              line-height: 52rpx;
              text-align: left;
            "
          >
            开启青少年模式需要设置独立四位密码，用户需要牢记密码，如果忘记可通过申诉重置密码，需要输入密码关闭青少年模式
          </text>
          <view style="display: flex; width: 60%; justify-content: center">
            <u-button
              class="modal-btn"
              @click="onSubmit"
              style="margin-right: 30rpx"
              >我知道了</u-button
            >
            <u-button
              @click="toTeen"
              class="modal-btn"
              color="linear-gradient(270deg, #4DCBA5 0%, #6BD6B5 100%)"
              >去开启</u-button
            >
          </view>
        </view>
      </u-action-sheet>

      <!-- <u-modal :show="notice_show">
        <div style="display: flex; flex-direction: column; align-items: center">
          <image
            style="width: 227rpx; height: 217rpx"
            src="/static/index-bg.png"
            alt=""
          />
          <p
            style="
              font-size: 34rpx;
              font-weight: 500;
              color: #000000;
              margin-top: 41rpx;
            "
          >
            未开启青少年模式
          </p>
          <p
            style="
              font-size: 30rpx;
              color: #333333;
              line-height: 48rpx;
              margin-top: 36rpx;
            "
          >
            青少年模式是零创动漫为促进青少年健康成长做出的一次尝试，我们优先针对核心场景进行了优化，也将继续致力于优化更多场景。
          </p>
          <div
            style="
              font-size: 30rpx;
              color: #36c4de;
              line-height: 42rpx;
              margin-top: 48rpx;
              display: flex;
              align-items: center;
            "
            @click="toTeen"
          >
            <span style="margin-right: 12rpx">开启青少年模式</span>
            <u-icon name="arrow-right" size="12" color="#36C4DE"></u-icon>
          </div>
        </div>

        <view
          slot="confirmButton"
          style="
            border-radius: 50px;
            background: linear-gradient(90deg, #90fced 0%, #76cefb 100%);
            font-size: 14px;
            color: #fff;
            display: flex;
            justify-content: center;
          "
          @click="onSubmit"
        >
          <view style="margin: 12px auto; font-weight: 500; color: #000000">
            {{ button_label }}
          </view>
        </view>
      </u-modal> -->
      <!-- <div class="showModal">
        <u-modal :show="showModal" width="432rpx">
          <view>
            <image
              style="width: 432rpx; height: 564rpx"
              src="./images/bg.png"
            ></image>
          </view>
          <view
            slot="confirmButton"
            style="
              border-radius: 50px;
              background: linear-gradient(90deg, #90fced 0%, #76cefb 100%);
              font-size: 14px;
              color: #fff;
              display: flex;
              justify-content: center;
            "
            @click="toSignIn"
          >
            <view style="margin: 12px auto; font-weight: 500; color: #000000">
            {{ "立即签到" }}
          </view>
          </view></u-modal
        >
      </div> -->

      <u-popup
        :show="showModal"
        mode="center"
        :round="16"
        @close="showModal = false"
      >
        <!-- <image
          style="width: 432rpx; height: 564rpx; position: relative"
          src="./images/bg.png"
        ></image> -->
        <view class="modal-content">
          <!-- <image
            style="width: 373rpx; height: 152rpx; transform: translateX(-50%)"
            src="./images/title.png"
          ></image> -->
          <view class="modal-title"> 每日签到领金币</view>
          <view
            style="
              font-size: 24rpx;
              margin-top: 8rpx;
              margin-bottom: 99rpx;
              color: #fff;
              width: 100%;
              text-align: center;
              line-height: 36rpx;
            "
            >签到越多，奖励越多哦～</view
          >
          <div
            style="
              display: flex;
              padding: 0 6rpx;
              margin-bottom: 16rpx;
              flex-wrap: wrap;
              justify-content: center;
            "
          >
            <div v-for="(item, index) in 7" class="item">
              <span
                style="
                  font-size: 22rpx;
                  color: #999;
                  line-height: 30rpx;
                  margin-top: 13rpx;
                "
                >{{ "第" + (index + 1) }}天</span
              >
              <view
                style="
                  position: absolute;
                  top: 10rpx;
                  left: 8rpx;
                  display: flex;
                  align-items: flex-start;
                "
              >
                <!-- <text
                  style="font-size: 24rpx; font-weight: 800; color: #fce0ba"
                >
                  {{ index + 1 }}</text
                > -->
                <!-- <image
                  style="width: 30rpx; height: 10rpx"
                  src="./images/day.png"
                ></image> -->
              </view>
              <image
                style="margin-bottom: 8rpx"
                :style="{
                  width: index + 1 <= dayNums ? '40rpx' : '69rpx',
                  height: index + 1 <= dayNums ? '40rpx' : '70rpx',
                }"
                :src="index + 1 <= dayNums ? checked : coinbg"
                alt=""
              />
              <span
                style="
                  font-size: 22rpx;
                  line-height: 30rpx;
                  color: #999;
                  margin-bottom: 15rpx;
                "
                >{{ "金币+" + item }}</span
              >
            </div>
          </div>
          <view style="width: 80%">
            <u-button
              v-if="dataList.length > 0"
              @click="taskTo(1)"
              class="modal-btn"
              color="linear-gradient(270deg, #4DCBA5 0%, #6BD6B5 100%)"
              >{{ dataList[0].init == 1 ? "已签到" : "签到" }}</u-button
            >
          </view>
          <!-- <view
            class="modal-btn"
            style="
              background-image: linear-gradient(
                270deg,
                #4dcba5 0%,
                #6bd6b5 100%
              );
            "
            @click="taskTo(1)"
            v-if="dataList.length > 0"
          >
            <text>{{ dataList[0].init == 1 ? "已签到" : "签到" }}</text>
          </view> -->
          <!-- <view
            style="
              font-size: 16rpx;
              width: calc(100% - 72rpx);
              margin-top: 17rpx;
              display: flex;
              align-items: center;
              justify-content: space-between;
            "
          >
            <text
              >已连续登录<text style="color: #d21d11">{{
                dayNums + "天"
              }}</text></text
            >
            <view style="display: flex; align-items: center">
              <text style="margin-right: 4rpx">签到提醒</text>
              <u-switch
                @change="handleChange"
                v-model="inactive"
                size="7"
              ></u-switch>
            </view>
          </view> -->
        </view>
        <!-- <image
          style="
            width: 373rpx;
            height: 152rpx;
            position: absolute;
            top: -37rpx;
            left: 50%;
            transform: translateX(-50%);
          "
          src="/pages/index/images/title.png"
        ></image>
        <view
          style="
            position: absolute;
            font-size: 18rpx;
            top: 140rpx;
            left: 30rpx;
            color: #535354;
          "
          >签到越多，奖励越多哦～</view
        >
        <view class="modal-btn" style="position: absolute">
          <text>立即签到</text>
        </view> -->
      </u-popup>
    </view>

    <app-update ref="app_update" :tabbar="true"></app-update>
  </view>
</template>

<script>
import ContentItem from "./component/indexItem.vue";
import MescrollItem from "./mescroll-swiper-item.vue";
import appUpdate from "@/components/yzhua006-update/app-update.vue";
import w_md5 from "../../js_sdk/zww-md5/w_md5.js";
import checked from "../ucenter/task/Images/checked.png";
import coinbg from "../ucenter/coin/images/1.png";
export default {
  components: {
    w_md5,
    appUpdate,
    MescrollItem,
    ContentItem,
  },
  data() {
    return {
      coinList: [],
      isActive: false,
      checked,
      coinbg,
      dayNums: 0,
      scrollTop: 0,
      notice_show: false, //公告显示状态
      notice_data: "", //公告内容
      up_nav_status: true,
      placeholder: false, //自定义导航栏是否填充高度禁止穿透
      height: "600px", // 需要固定swiper的高度
      heightt: "600px", // 需要固定swiper的高度
      tabIndex: 0, // 当前tab的下标
      isLogin: true,
      nav_status: false,
      button_label: "我知道了",
      nav_color: "rgba(0,0,0,0)",
      search_bgColor: "rgba(245,245,245,0.3)",
      search_color: "#fff",
      inactiveStyle: { color: "#ffffff" },
      activeStyle: {
        color: "#ffffff",
        "font-size": "20px",
        "font-weight": "bold",
      },
      inactive: false,
      tabs: [
        {
          name: "推荐",
        },
      ],
      gj_loading: true,
      lunbo_loading: true,
      time: "",
      token: "",
      app_key: "",
      websiteUrl: "",
      statusHeight: 0,
      hits_list: [],
      hits_one: {},
      lunbo_list: [],
      new_list: [],
      jx_list: [], //APP精选必看总列表
      jx_data: [], //APP精选必看内容,显示6个
      loading_show: true,
      showModal: false,
      dataList: [],
    };
  },
  onPullDownRefresh() {
    // this.index_data();
  },
  onLoad() {
    // 需要固定swiper的高度
    // #ifndef H5
    this.height = uni.getSystemInfoSync().windowHeight + "px";
    this.heightt = uni.getSystemInfoSync().windowHeight + "px";
    // #endif
    // #ifdef H5
    this.height = uni.getSystemInfoSync().windowHeight + "px";
    this.heightt = uni.getSystemInfoSync().windowHeight + 50 + "px";
    // #endif

    this.statusHeight = uni.getSystemInfoSync().statusBarHeight + 44 + "px";
    // this.req_index()
    // this.getNotice()
    this.get_tabs();
  },
  onReady() {
    this.$refs.app_update.update();
  },
  onPageScroll: function (e) {
    //nvue暂不支持滚动监听，可用bindingx代替
    // if(e.scrollTop>28){
    //  this.nav_color = "#fff"
    // 	this.inactiveStyle.color = "#000000"
    // 	this.activeStyle.color = "#000000"
    // 	this.search_bgColor = "#f7f7f7"
    // 	this.search_color = "#6f6f6f"
    // }else{
    // 	this.nav_color = "rgba(0,0,0,0)"
    // 	this.inactiveStyle.color = "#ffffff"
    // 	this.activeStyle.color = "#ffffff"
    // 	this.search_bgColor = "rgba(245,245,245,0.3)"
    // 	this.search_color = "#fff"
    this.scrollTop = e.scrollTop;

    // }
  },
  onShow() {
    this.notice_show = false;
    if (!uni.getStorageSync("user")) {
      console.log("未登录", uni.getStorageSync("user"));
      this.isLogin = true;
    } else {
      console.log("已登录", uni.getStorageSync("user"));
      this.isLogin = false;
    }
    this.tabIndex = 0;
    this.needTeena();
  },
  methods: {
    // getNotice() {
    //   uni.request({
    //     url: getApp().globalData.websiteUrl + "/index.php/appv1/kxapps/notice",
    //     success: (res) => {
    //       console.log(res.data);
    //       this.notice_data = res.data.text;
    //       if (parseInt(res.data.mode) == 1) {
    //         this.notice_show = true;
    //       }
    //     },
    //   });
    // },
    onLoadend() {
      // this.loading_show = false;
      plus.navigator.closeSplashscreen();
    },
    getTaskList() {
      var time = new Date().getTime();
      this.app_key = getApp().globalData.websiteKey;
      var param =
        "deviceid=" +
        getApp().globalData.deviceid +
        "&facility=" +
        getApp().globalData.facility +
        "&timestamp=" +
        time +
        "&user_id=" +
        uni.getStorageSync("user").uid +
        "&user_token=" +
        uni.getStorageSync("user").utoken;
      var sign = w_md5.hex_md5_32Upper(param + this.app_key);
      uni.request({
        url:
          getApp().globalData.websiteUrl +
          "/index.php/appv1/task/tasklist?" +
          param +
          "&sign=" +
          sign,
        success: (res) => {
          console.log(res.data);
          this.coinList = res.data.code.coin;
          this.dayNums = res.data.code.day;
          // this.invite_text = res.data.text;
        },
      });
    },
    get_tabs() {
      var time = new Date().getTime();
      this.app_key = getApp().globalData.websiteKey;
      var param =
        "deviceid=" +
        getApp().globalData.deviceid +
        "&facility=" +
        getApp().globalData.facility +
        "&timestamp=" +
        time;
      var sign = w_md5.hex_md5_32Upper(param + this.app_key);
      uni.request({
        url:
          getApp().globalData.websiteUrl +
          "/index.php/appv1/kxapps/type?" +
          param +
          "&sign=" +
          sign,
        success: (res) => {
          console.log("分类列表: ", res.data);
          this.tabs = this.tabs.concat(
            res.data.list.map((item) => {
              return {
                ...item,
                disabled: true,
              };
            })
          );
          // this.mescroll.triggerDownScroll();
          // this.get_top();
        },
      });
    },
    async needTeena() {
      if (uni.getStorageSync("user")) {
        this.getTaskList();
        await this.get_tasklist();
        const data = JSON.parse(uni.getStorageSync("teenData"));
        if (data.teen_status == "0" && !this.isActive) {
          this.notice_show = true;
        } else {
          uni.getStorage({
            key: "notice",
            success: (res) => {
              if (res.data && this.dataList[0].init != 1) {
                this.showModal = true;
                this.inactive = true;
              }
            },
          });
        }
      } else if (!this.isActive) {
        this.notice_show = true;
      }
    },
    onSubmit() {
      this.notice_show = false;
      this.isActive = true;
      uni.getStorage({
        key: "notice",
        success: (res) => {
          if (res.data && this.dataList[0].init != 1) {
            this.showModal = true;
            this.inactive = true;
          }
        },
      });
    },
    getMsg(res) {
      if (res) {
        // this.nav_color = "#fff";
        // this.inactiveStyle.color = "#000000";
        // this.activeStyle.color = "#000000";
        this.search_bgColor = "#f7f7f7";
        this.search_color = "#6f6f6f";
        this.nav_status = true;
      } else {
        this.nav_color = "rgba(0,0,0,0)";
        this.inactiveStyle.color = "#ffffff";
        this.activeStyle.color = "#ffffff";
        this.search_bgColor = "rgba(245,245,245,0.3)";
        this.search_color = "#fff";
        this.nav_status = false;
      }
    },
    // 轮播菜单
    swiperChange(e) {
      this.tabIndex = e.detail.current;
      if (this.tabIndex == 1) {
        // this.up_nav_status = false
        // this.placeholder = true
        // this.nav_color = "#fff";
        // this.inactiveStyle.color = "#000000";
        // this.activeStyle.color = "#000000";
        this.search_bgColor = "#f7f7f7";
        this.search_color = "#6f6f6f";
      } else {
        // this.up_nav_status = true
        // this.placeholder = false
        if (this.nav_status) {
          // this.nav_color = "#fff";
          // this.inactiveStyle.color = "#000000";
          // this.activeStyle.color = "#000000";
          this.search_bgColor = "#f7f7f7";
          this.search_color = "#6f6f6f";
          this.nav_status = true;
        } else {
          this.nav_color = "rgba(0,0,0,0)";
          this.inactiveStyle.color = "#ffffff";
          this.activeStyle.color = "#ffffff";
          this.search_bgColor = "rgba(245,245,245,0.3)";
          this.search_color = "#fff";
          this.nav_status = false;
        }
      }
    },
    toLogin() {
      uni.navigateTo({
        url: "../login/login",
      });
    },
    click_tab(item) {
      if (item.index !== 0) {
        this.tabIndex = 0;
        this.chakangengduo(item.id);
      }
      // this.tabIndex = item.index;
      // console.log('item', item);
      if (this.tabIndex == 1) {
        // this.placeholder = true
        // this.nav_color = "#fff";
        // this.inactiveStyle.color = "#000000";
        // this.activeStyle.color = "#000000";
        this.search_bgColor = "#f7f7f7";
        this.search_color = "#6f6f6f";
      } else {
        // this.placeholder = false
        if (this.nav_status) {
          // this.nav_color = "#fff";
          // this.inactiveStyle.color = "#000000";
          // this.activeStyle.color = "#000000";
          this.search_bgColor = "#f7f7f7";
          this.search_color = "#6f6f6f";
          this.nav_status = true;
        } else {
          this.nav_color = "rgba(0,0,0,0)";
          this.inactiveStyle.color = "#ffffff";
          this.activeStyle.color = "#ffffff";
          this.search_bgColor = "rgba(245,245,245,0.3)";
          this.search_color = "#fff";
          this.nav_status = false;
        }
      }
    },
    chakangengduo(id) {
      getApp().globalData.tabId = id;
      uni.switchTab({
        url: "/pages/class/class",
        fail(e) {
          console.log(e);
        },
      });
    },
    imageError: function (e, index) {
      // console.error('image发生error事件，携带值为' + e.detail.errMsg)
      this.new_list[index]["cover_url"] = "../../static/img_error.jpg";
    },
    req_index() {
      var _this = this;
      uni.getSystemInfo({
        success: function (res) {
          getApp().globalData.facility = res.platform; //ios  or android
          console.log("手机系统信息", getApp().globalData.facility);
        },
      });
      if (getApp().globalData.facility == "ios") {
        plus.device.getInfo({
          success: function (e) {
            getApp().globalData.deviceid = e.uuid;
            console.log(getApp().globalData.deviceid);
            // _this.index_data();
            _this.$refs.app_update.update();
          },
          fail: function (e) {
            console.log(e);
          },
        });
      } else {
        plus.device.getAAID({
          success: function (e) {
            getApp().globalData.deviceid = e.aaid;
            console.log(getApp().globalData.deviceid);
            _this.index_data();
            _this.$refs.app_update.update();
          },
          fail: function (e) {
            console.log(e);
            plus.device.getInfo({
              success: (res) => {
                getApp().globalData.deviceid = res.uuid;
                console.log(getApp().globalData.deviceid);
                _this.index_data();
                _this.$refs.app_update.update();
              },
            });
          },
        });
      }
    },
    search() {
      uni.navigateTo({
        url: "../search/search",
      });
    },
    more_click() {
      uni.navigateTo({
        url: "../class/class",
      });
    },
    get_tasklist() {
      var time = new Date().getTime();
      this.app_key = getApp().globalData.websiteKey;

      var param =
        "deviceid=" +
        getApp().globalData.deviceid +
        "&facility=" +
        getApp().globalData.facility +
        "&timestamp=" +
        time +
        "&user_id=" +
        uni.getStorageSync("user").uid +
        "&user_token=" +
        uni.getStorageSync("user").utoken;

      var sign = w_md5.hex_md5_32Upper(param + this.app_key);
      return new Promise((resolve) => {
        uni.request({
          url:
            getApp().globalData.websiteUrl +
            "/index.php/appv1/task/index?" +
            param +
            "&sign=" +
            sign,
          success: (res) => {
            console.log("任务列表：", res.data);
            if (res.data.code == 1) {
              this.dataList = res.data.list;
            } else {
              uni.showToast({
                icon: "none",
                position: "bottom",
                title: "数据请求失败",
              });
              uni.navigateBack({});
            }
            resolve();
          },
        });
      });
    },
    grid_click(index) {
      console.log(index);
      if (index == 0) {
        uni.navigateTo({
          url: "../newest/newest",
        });
      }
      if (index == 1) {
        uni.navigateTo({
          url: "../ranking/ranking",
        });
      }
      if (index == 2) {
        uni.navigateTo({
          url: "../class/class",
        });
      }
    },
    // onClick() {
    //   window.scrollTo({ top: 0 });
    // },
    lunbo_click(index) {
      this.get_detail(this.lunbo_list[index].id);
    },
    get_detail(id) {
      console.log(id);
      uni.navigateTo({
        url: "../detail/detail?id=" + id,
      });
    },
    handleChange(value) {
      uni.setStorage({
        key: "notice",
        data: value,
      });
    },
    index_data() {
      var time = new Date().getTime();
      this.app_key = getApp().globalData.websiteKey;

      var param =
        "deviceid=" +
        getApp().globalData.deviceid +
        "&facility=" +
        getApp().globalData.facility +
        "&reco_size=7&timestamp=" +
        time;
      var sign = w_md5.hex_md5_32Upper(param + this.app_key);

      uni.request({
        url:
          getApp().globalData.websiteUrl +
          "/index.php/appv1/comic/index?" +
          param +
          "&sign=" +
          sign,
        success: (res) => {
          // console.log(res.data)
          this.hits_list = res.data.data.reco;
          this.hits_one = this.hits_list[0];
          this.hits_list.shift(); //删除数组第一个元素
          this.lunbo_list = res.data.data.banner;
          this.new_list = res.data.data.news;
          this.jx_data = res.data.data.class;
          this.lunbo_loading = false;
          this.gj_loading = false;
          uni.stopPullDownRefresh();
        },
      });
    },
    toTeen() {
      if (uni.getStorageSync("user")) {
        uni.navigateTo({
          url: "/pages/ucenter/teenager/index",
        });
      } else {
        uni.navigateTo({
          url: "/pages/login/login",
        });
      }
    },
    taskTo(id) {
      if (this.dataList[0].init == 1) return;
      if (id == "1") {
        var time = new Date().getTime();
        this.app_key = getApp().globalData.websiteKey;
        var param =
          "deviceid=" +
          getApp().globalData.deviceid +
          "&facility=" +
          getApp().globalData.facility +
          "&tid=" +
          id +
          "&timestamp=" +
          time +
          "&user_id=" +
          uni.getStorageSync("user").uid +
          "&user_token=" +
          uni.getStorageSync("user").utoken;
        var sign = w_md5.hex_md5_32Upper(param + this.app_key);
        uni.request({
          url:
            getApp().globalData.websiteUrl +
            "/index.php/appv1/task/add?" +
            param +
            "&sign=" +
            sign,
          success: (res) => {
            console.log("任务结果：", res.data);
            if (res.data.code == 1) {
              uni.showToast({
                icon: "success",
                title: res.data.msg,
              });
              this.showModal = false;
            } else {
              uni.showToast({
                icon: "none",
                position: "bottom",
                title: "数据请求失败",
              });
            }
          },
        });
      } else if (id == "2") {
        let text = this.invite_text.replace(/{code}/g, this.invite_code);
        uni.shareWithSystem({
          summary: text,
          href: "", //ios必须带链接字段
          success() {
            // 分享完成，请注意此时不一定是成功分享
          },
          fail() {
            // 分享失败
          },
        });
      } else {
        uni.switchTab({
          url: "/pages/index/index",
        });
      }
    },
  },
};
</script>

<style lang="scss">
page {
  height: auto;
  overflow-x: hidden;
}
.header {
  position: relative;
  &::after {
    content: "";
    background-image: url("/static/bg.png");
    background-size: 100% 100%;
    height: 615rpx;
    display: block;
    position: absolute;
    width: 100%;
  }
  &-top {
    height: 88rpx;
    // background: rgba(225, 242, 244, 0.71);

    background: linear-gradient(
      180deg,
      rgba(0, 0, 0, 0.8) 0%,
      rgba(216, 216, 216, 0) 100%
    );
    filter: blur(50px);
  }

  &-bottom {
    flex: 1;
  }
}

.content {
  // position: absolute;
  // width: 100%;
  // margin-top: 159rpx;
  // padding: 0 24rpx;
}

.lists {
  // margin-top: 5px;
  // width: 100%;
  // margin-left: auto;
  // margin-right: auto;
  display: flex;
  text-align: left;
  // justify-content: space-around;
  // align-items: flex-start;
}

button::after {
  border: none;
}

.i_new_title {
  font-size: 14px;
  font-weight: 300;
  color: #fff;
  display: -webkit-box;
  /* -webkit-box-orient: vertical; */
  /*! autoprefixer: off */
  -webkit-box-orient: vertical;
  /* autoprefixer: on */
  -webkit-line-clamp: 1;
  overflow: hidden;
}
.grid-text {
  font-size: 12px;
  /* color: #909399; */
  padding: 5rpx 0 20rpx 0rpx;
}

.scroll-list {
  @include flex(column);

  &__goods-item {
    margin-right: 10px;

    &__image {
      width: 80px;
      height: 110px;
      border-radius: 8px;
    }

    &__text {
      color: #f56c6c;
      text-align: center;
      font-size: 12px;
      margin-top: 5px;
    }
  }

  &__show-more {
    background-color: #fff0f0;
    border-radius: 3px;
    padding: 3px 6px;
    @include flex(column);
    align-items: center;

    &__text {
      font-size: 12px;
      width: 12px;
      color: #f56c6c;
      line-height: 16px;
    }
  }
}
.modal-btn {
  height: 72rpx;
  width: 100px;
  border-radius: 40rpx;
}
.modal-content {
  background-image: url("./images/bg.png");
  width: 600rpx;
  height: 761rpx;
  background-size: 100% 100%;
  background-position: 0 center;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.modal-title {
  font-size: 48rpx;
  font-family: SourceHanSansCN, SourceHanSansCN;
  font-weight: bold;
  color: #ffffff;
  line-height: 71rpx;
  margin-top: 28rpx;
}
.item {
  width: 117rpx;
  height: 156rpx;
  background: #f0f8f5;
  border-radius: 8rpx;
  margin-right: 17rpx;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  position: relative;
  margin-bottom: 13rpx;
}
</style>
